<%
local model = luci.sys.exec("cat /proc/xiaoqiang/model")
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<%include("web/inc/head")%>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>Misstar Tools - 小米路由器</title>
		<meta name="Copyright" content="Douco Design." />
		<meta name="viewport" content="width=1200">
		<!--<link href="<%=resource%>/web/luci/css/public.css" rel="stylesheet" type="text/css">-->
		<!--<link href="<%=resource%>/web/css/bc.css?v=<%=ver%>" rel="stylesheet">
		<link href="<%=resource%>/web/css/vpn.css?v=<%=ver%>" rel="stylesheet">-->
		<script type="text/javascript" src="<%=resource%>/web/luci/js/jquery.min.js"></script>
		<!--<script type="text/javascript" src="<%=resource%>/web/luci/js/global.js"></script>-->
		<!--<script type="text/javascript" src="<%=resource%>/web/luci/js/jquery.tab.js"></script>-->
		<script type="text/javascript" src="<%=resource%>/web/luci/js/qwrap.js"></script>
		<script type="text/javascript" src="<%=resource%>/web/luci/js/jbase64.js"></script>
		<link rel="stylesheet" href="<%=resource%>/web/luci/css/global.css" media="all">
		<link rel="stylesheet" href="<%=resource%>/web/luci/plugins/font-awesome/css/font-awesome.min.css">
		<link rel="stylesheet" href="<%=resource%>/web/luci/plugins/layui/css/layui.css" media="all" />
		<link rel="stylesheet" href="<%=resource%>/web/luci/plugins/font-awesome/css/font-awesome.min.css">
		<link href="<%=resource%>/web/luci/css/misstar.css" rel="stylesheet" type="text/css">
	</head>

	<body style="background: white;width: 100%;height: 100%;">
		<fieldset class="layui-elem-field">
			<legend>工作状态</legend>
			<div class="layui-field-box">
				<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label">插件版本</label>
						<div class="layui-form-mid" id="version">{$version}
						</div>
						<div class="box site-demo-active" style="top: 15px;float: left;display: none;" id="upgrade">
							<a href="javascript:;" style="top: 15px;" class="layui-btn layui-btn-normal  layui-btn-small" onclick="upgrade();">升级</a>
						</div>
					</div>
				</div>
				<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label">进程状态</label>
						<div class="layui-form-mid layui-word-aux" id="ss_status">查询中...</div>
					</div>
				</div>
				<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label">SS节点</label>
						<div class="layui-form-mid layui-word-aux" id="ss_node">查询中...</div>
					</div>
				</div>
				<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label">DNS状态</label>
						<div class="layui-form-mid layui-word-aux" id="dns_status">查询中...</div>
					</div>
				</div>
			</div>
		</fieldset>
		<form class="layui-form" method="POST" name="dns" id="dns">
			<div id="dns_body">
			</div>
		</form>
		<fieldset class="layui-elem-field layui-field-title" style="float: none;">
			<legend>节点列表</legend>
			<div class="layui-field-box">
				<blockquote class="layui-elem-quote">
					<a href="javascript:;" class="layui-btn layui-btn-small" data-type="add">
						<i class="layui-icon">&#xe608;</i> 添加节点
					</a>
					<a href="javascript:;">
						<input type="file" id="uploadfile" style="display: none;" />
						<button class="layui-btn layui-btn-small" data-type="import"><i class="layui-icon">&#xe608;</i>导入节点</button>
					</a>
				</blockquote>
				<table class="site-table table-hover">
					<thead>
						<tr>
							<th>节点名称</th>
							<th>节点地址</th>
							<th>节点端口</th>
							<th>工作模式</th>
							<th>状态</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody id='sslist'>
						<tr>
							<td class="center" colspan="6">
								<%:查询中....%>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
		</fieldset>
		<fieldset class="layui-elem-field layui-field-title">
			<legend>局域网控制</legend>
			<div class="layui-field-box">
				<table class="site-table table-hover">
					<thead>
						<tr>
							<th width="20%">主机名</th>
							<th width="20%">IP</th>
							<th width="20%">MAC</th>
							<th>科学上网</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody id='lanconlist'>
						<tr>
							<td class="center" colspan="5">
								<%:查询中....%>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
		</fieldset>
		<fieldset class="layui-elem-field layui-field-title">
			<legend>自定义Gfwlist</legend>
			<div class="layui-field-box">
				<blockquote class="layui-elem-quote">
					<a href="javascript:;" class="layui-btn layui-btn-small" data-type="addgfw">
						<i class="layui-icon">&#xe608;</i> 添加地址
					</a>
					<a href="javascript:;">
						<input type="file" id="uploadfile" style="display: none;" />
						<button class="layui-btn layui-btn-small" data-type="importgfw"><i class="layui-icon">&#xe608;</i>导入地址</button>
					</a>
				</blockquote>
				<table class="site-table table-hover">
					<thead>
						<tr>
							<th width="20%">编号</th>
							<th width="60%">地址</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody id='gfwlist'>
						<tr>
							<td class="center" colspan="3">
								<%:查询中....%>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
		</fieldset>
		<fieldset class="layui-elem-field layui-field-title">
			<legend>自定义白名单</legend>
			<div class="layui-field-box">
				<blockquote class="layui-elem-quote">
					<a href="javascript:;" class="layui-btn layui-btn-small" data-type="addwhite">
						<i class="layui-icon">&#xe608;</i> 添加地址
					</a>
					<a href="javascript:;">
						<input type="file" id="uploadfile" style="display: none;" />
						<button class="layui-btn layui-btn-small" data-type="importwhite"><i class="layui-icon">&#xe608;</i>导入地址</button>
					</a>
				</blockquote>
				<table class="site-table table-hover">
					<thead>
						<tr>
							<th width="20%">编号</th>
							<th width="60%">地址</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody id='whitelist'>
						<tr>
							<td class="center" colspan="3">
								<%:查询中....%>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
		</fieldset>
		<div id="footer" style="text-align: center;">
			<div class="line"></div>
			<ul>
				版权所有 © 2013-2017
				<a href="http://www.misstar.com">Misstar Studio</a>，并保留所有权利。
			</ul>
		</div>
		<script type="text/javascript" src="<%=resource%>/web/luci/plugins/layui/layui.js"></script>

		<script type="tmpl/html" id="tplsslist">
			{if($sslist.length > 0)} {for(var i=0; i
			<$sslist.length; i++)} <tr id="{$sslist[i].id}" class="{if($sslist[i].iscurrent == 1)}conn-st-5{else}conn-st-3{/if}">
				<td>{$sslist[i].ss_name}</td>
				<td>{$sslist[i].ss_server}</td>
				<td>{$sslist[i].ss_server_port}</td>
				<td>{$sslist[i].ss_mode}</td>
				<td><span class="ss-status">
            		<span class="val">
            	{if($sslist[i].iscurrent == 1)}
					<%:查询中...%> {else}
					<%:未启用%> {/if}
					</span>
					<span class="uptime"></span>
					</span>
				</td>
				<td>
					<span class="ss_status">
						<span class="control">
					{if($sslist[i].iscurrent == 1)}
						<a href="javascript:;" class="layui-btn layui-btn-normal layui-btn-mini" data-type="disconnect" data-id={$sslist[i].id}>断开连接</a>
{else}
						<a href="javascript:;" class="layui-btn layui-btn-normal layui-btn-mini" data-type="connect" data-id={$sslist[i].id}>连接</a>
						<a href="javascript:;" class="layui-btn layui-btn-mini" data-type="edit" data-id={$sslist[i].id}>编辑</a>
						<a href="javascript:;" class="layui-btn layui-btn-danger layui-btn-mini" data-type="del" data-id={$sslist[i].id}>删除</a>{/if}
						</span>
					</span>
				</td>
				</tr>
				{/for} {else}
				<tr>
					<td colspan="7" class="center">
						<%:没有设置信息%>
					</td>
				</tr>
				{/if}
		</script>
		<script type="tmpl/html" id="tpladdss">
			<form class="layui-form" method="POST" name="ss" id="ss">
				<input type="hidden" name="id" value="{$id}">

				<div class="layui-form-item">
					<label class="layui-form-label">节点名称</label>
					<div class="layui-input-inline">
						<input type="text" name="ss_name" lay-verify="required" autocomplete="off" placeholder="节点名称" class="layui-input" value="{$ss_name}">
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">服务器地址</label>
					<div class="layui-input-inline">
						<input type="text" name="ss_server" lay-verify="required" autocomplete="off" placeholder="请输入服务器域名或者IP" class="layui-input" value="{$ss_server}">
					</div>
				</div>

				<div class=" layui-form-item ">
					<label class="layui-form-label ">服务器端口</label>
					<div class="layui-input-inline ">
						<input type="number " name="ss_server_port" lay-verify="required" lay-verify="number" autocomplete="off " class="layui-input " value="{$ss_server_port}">
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">连接密码</label>
					<div class="layui-input-inline">
						<input type="password" name="ss_password" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input" value="{$ss_password}">
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">加密方式</label>
					<div class="layui-input-inline">
						<select name="ss_method" lay-filter="ss_method">
							<option value="table" {if($ss_method=='table' )}selected="selected" {/if}>table</option>
							<option value="rc4" {if($ss_method=='rc4' )}selected="selected" {/if}>rc4</option>
							<option value="rc4-md5" {if($ss_method=='rc4-md5' )}selected="selected" {/if}>rc4-md5</option>
							<option value="aes-128-cfb" {if($ss_method=='aes-128-cfb' )}selected="selected" {/if}>aes-128-cfb</option>
							<option value="aes-192-cfb" {if($ss_method=='aes-192-cfb' )}selected="selected" {/if}>aes-192-cfb</option>
							<option value="aes-256-cfb" {if($ss_method=='aes-256-cfb' )}selected="selected" {/if}>aes-256-cfb</option>
							<option value="aes-128-ctr" {if($ss_method=='aes-128-ctr' )}selected="selected" {/if}>aes-128-ctr</option>
							<option value="aes-192-ctr" {if($ss_method=='aes-192-ctr' )}selected="selected" {/if}>aes-192-ctr</option>
							<option value="aes-256-ctr" {if($ss_method=='aes-256-ctr' )}selected="selected" {/if}>aes-256-ctr</option>
							<option value="bf-cfb" {if($ss_method=='bf-cfb' )}selected="selected" {/if}>bf-cfb</option>
							<option value="camellia-128-cfb" {if($ss_method=='camellia-128-cfb' )}selected="selected" {/if}>camellia-128-cfb</option>
							<option value="camellia-192-cfb" {if($ss_method=='camellia-192-cfb' )}selected="selected" {/if}>camellia-192-cfb</option>
							<option value="camellia-256-cfb" {if($ss_method=='camellia-256-cfb' )}selected="selected" {/if}>camellia-256-cfb</option>
							<option value="salsa20" {if($ss_method=='salsa20' )}selected="selected" {/if}>salsa20</option>
							<option value="chacha20" {if($ss_method=='chacha20' )}selected="selected" {/if}>chacha20</option>
							<option value="chacha20-ietf" {if($ss_method=='chacha20-ietf' )}selected="selected" {/if}>chacha20-ietf</option>
						</select>
					</div>
				</div>
				<div class="layui-form-item">

					<label class="layui-form-label">工作模式</label>
					<div class="layui-input-inline">
						<select name="ss_mode" lay-filter="ss_mode">
							<option value="gfwlist" {if($ss_mode=='gfwlist' )}selected="selected" {/if}>GfwList</option>
							<option value="gamemode" {if($ss_mode=='gamemode' )}selected="selected" {/if}>游戏模式</option>
							<option value="whitelist" {if($ss_mode=='whitelist' )}selected="selected" {/if}>白名单</option>
							<option value="wholemode" {if($ss_mode=='wholemode' )}selected="selected" {/if}>全局模式</option>
						</select>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">ssr</label>
					<div class="layui-input-inline">
						<input type="checkbox" name="ssr_enable" title="ssr" {if($ssr_enable=='1' )}checked="true" {/if}>
					</div>

				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">协议</label>
					<div class="layui-input-inline">
						<select name="ssr_protocol" lay-filter="ssr_protocol">
							<option value="origin" {if($ssr_protocol=='origin' )}selected="selected" {/if}>origin</option>
							<option value="verify_simple" {if($ssr_protocol=='verify_simple' )}selected="selected" {/if}>verify_simple</option>
							<option value="verify_sha1" {if($ssr_protocol=='verify_sha1' )}selected="selected" {/if}>verify_sha1</option>
							<option value="auth_sha1_v2" {if($ssr_protocol=='auth_sha1_v2' )}selected="selected" {/if}>auth_sha1_v2</option>
							<option value="auth_sha1_v4" {if($ssr_protocol=='auth_sha1_v4' )}selected="selected" {/if}>auth_sha1_v4</option>
							<option value="auth_aes128_md5" {if($ssr_protocol=='auth_aes128_md5' )}selected="selected" {/if}>auth_aes128_md5</option>
							<option value="auth_aes128_sha1" {if($ssr_protocol=='auth_aes128_sha1' )}selected="selected" {/if}>auth_aes128_sha1</option>
						</select>
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">混淆方式</label>
					<div class="layui-input-inline">
						<select name="ssr_obfs" lay-filter="ssr_obfs">
							<option value="plain" {if($ssr_obfs=='plain' )}selected="selected" {/if}>plain</option>
							<option value="http_simple" {if($ssr_obfs=='http_simple' )}selected="selected" {/if}>http_simple</option>
							<option value="http_post" {if($ssr_obfs=='http_post' )}selected="selected" {/if}>http_post</option>
							<option value="tls1.2_ticket_auth" {if($ssr_obfs=='tls1.2_ticket_auth' )}selected="selected" {/if}>tls1.2_ticket_auth</option>
						</select>
					</div>
				</div>
				<div class="layui-form-item">
					<div class="layui-input-block">
						<button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
						<button type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>
			</form>
		</script>
		<script type="tmpl/html" id="tpladdgfw">
			<form class="layui-form" method="POST" name="gfw" id="gfw">
				<div class="layui-form-item">
					<label class="layui-form-label">添加地址</label>
					<div class="layui-input-inline">
						<input type="text" name="address" lay-verify="gfwverify" autocomplete="off" placeholder="比如：baidu.com" class="layui-input" value="">
					</div>
				</div>

				<div class="layui-form-item">
					<div class="layui-input-block">
						<button class="layui-btn" lay-submit="" lay-filter="gfwlist">立即提交</button>
						<button type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>
			</form>
		</script>
		<script type="tmpl/html" id="tpladdwhite">
			<form class="layui-form" method="POST" name="white" id="white">

				<div class="layui-form-item">
					<label class="layui-form-label">添加地址</label>
					<div class="layui-input-inline">
						<input type="text" name="address" lay-verify="whiteverify" autocomplete="off" placeholder="比如：192.168.31.0/24" class="layui-input" value="">
					</div>
				</div>

				<div class="layui-form-item">
					<div class="layui-input-block">
						<button class="layui-btn" lay-submit="" lay-filter="whitelist">立即提交</button>
						<button type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>
			</form>
		</script>
		<script type="tmpl/html" id="dnsbody">
			<fieldset class="layui-elem-field">
				<legend>DNS加强</legend>
				<div class="layui-field-box">
					<div class="layui-form-item">
						<label class="layui-form-label">模式</label>
						<div class="layui-input-inline" id="dns_mode">
							<select name="dns_mode" lay-filter="dns_mode">
								<option value="pdnsd" {if($dns_mode=='pdnsd' )}selected="selected" {/if}>PDNSD</option>
								<option value="dns2socks" {if($dns_mode=='dns2socks' )}selected="selected" {/if}>DNS2SOCKS</option>
							</select>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">上级DNS</label>
						<div class="layui-input-inline">
							<input type="text" name="dns_server" id="dns_server" lay-verify="required" onclick="tips('为了插件的高可用性，pdnsd模式下插件内置Opendns和Google DNS服务器，如果您配置的DNS服务器查询失败则会尝试上述2组服务器。','#dns_server');" autocomplete="off" placeholder="比如：8.8.8.8" class="layui-input" value="{$dns_server}">
						</div>
					</div>
					<div class=" layui-form-item ">
						<label class="layui-form-label ">端口</label>
						<div class="layui-input-inline ">
							<input type="number " name="dns_port" id="dns_port" lay-verify="number" autocomplete="off" placeholder="比如：53" class="layui-input " value="{$dns_port}">
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">DNS重定向</label>
						<div class="layui-input-inline" id="dns_red_enable" onclick="tips('如果路由翻墙正常但是电脑不正常，建议开启DNS重定向,可解决电脑DNS被劫持等问题','#dns_red_enable');">
							<input type="checkbox" name="dns_red_enable" title="开启" {if($dns_red_enable=='1' )}checked="true" {/if}>
						</div>

					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">重定向地址</label>
						<div class="layui-input-inline">
							<input type="text" name="dns_red_ip" id="dns_red_ip" autocomplete="off" placeholder="默认请留空" onclick="tips('留空IP为路由器IP（192.168.31.1）','#dns_red_ip');" class="layui-input" value="{$dns_red_ip}">
						</div>
					</div>
					<div class="layui-form-item">
						<div class="layui-input-block">
							<button class="layui-btn" lay-submit="" lay-filter="dnssetting">立即提交</button>
							<button type="reset" class="layui-btn layui-btn-primary">重置</button>
						</div>
					</div>
				</div>
			</fieldset>
		</script>
		<script type="tmpl/html" id="tpllanconlist">
			<tr>
				<td>
					<select name="hostname" lay-filter="hostname" id="hostname" onclick="loaddevlist();">
						<option value="0">请选择设备</option>
					</select>
				</td>
				<td><span id="hostip"></span></td>
				<td><span id="hostmac"></span></td>
				<td>
					<select name="mode" lay-filter="mode" id="add">
						<option value="0">不走SS</option>
						<option value="1">科学上网</option>
					</select>
				</td>
				<td align="center">
					<a href="javascript:;" class="layui-btn layui-btn-normal layui-btn-mini" data-type="submit" data-id="add">添加</a>
				</td>
			</tr>

			{if($lanconlist.length > 0)} {for(var i=0; i
			< $lanconlist.length; i++)} <tr>
				<td>{$lanconlist[i].name}</td>
				<td>{$lanconlist[i].ip}</td>
				<td>{$lanconlist[i].mac}</td>
				<td>
					<select name="mode" id={$lanconlist[i].mac} lay-filter="mode">
						<option value="0" {if($lanconlist[i].mode=="0" )}selected="selected" {/if}>不走SS</option>
						<option value="1" {if($lanconlist[i].mode=="1" )}selected="selected" {/if}>科学上网</option>
					</select>
				</td>
				<td align="center">
					<a href="javascript:;" class="layui-btn layui-btn-normal layui-btn-mini" data-type="submit" data-id={$lanconlist[i].mac}>提交</a>
					<a href="javascript:;" class="layui-btn layui-btn-danger layui-btn-mini" data-type="delete" data-id={$lanconlist[i].mac}>删除</a>
				</td>
				</tr>
				{/for} {/if}

				<tr>
					<td>缺省规则</td>
					<td>缺省规则</td>
					<td>缺省规则</td>
					<td>
						<select name="mode" lay-filter="mode" id="default">
							<option value="0" {if($lanconlist.ss_acl_default_mode=='0' )}selected="selected" {/if}>不走SS</option>
							<option value="1" {if($lanconlist.ss_acl_default_mode=='1' )}selected="selected" {/if}>科学上网</option>
						</select>
					</td>
					<td align="center">
						<a href="javascript:;" class="layui-btn layui-btn-normal layui-btn-mini" data-type="submit" data-id="default">提交</a>
					</td>
				</tr>
		</script>
		<script type="tmpl/html" id="tplgfwlist">
			{if($gfwlist.length > 0)} {for(var i=0; i
			< $gfwlist.length; i++)} <tr>
				<td>{$gfwlist[i].id}</td>
				<td>{$gfwlist[i].address}</td>
				<td align="center">
					<a href="javascript:;" class="layui-btn layui-btn-danger layui-btn-mini" data-type="delgfw" data-id={$gfwlist[i].address}>删除</a>
				</td>

				</tr>
				{/for} {else}
				<tr>
					<td colspan="3" class="center">没有设置信息</td>
				</tr>
				{/if}
		</script>
		<script type="tmpl/html" id="tplwhitelist">
			{if($whitelist.length > 0)} {for(var i=0; i
			< $whitelist.length; i++)} <tr>
				<td>{$whitelist[i].id}</td>
				<td>{$whitelist[i].address}</td>
				<td align="center">
					<a href="javascript:;" class="layui-btn layui-btn-danger layui-btn-mini" data-type="delwhite" data-id={$whitelist[i].address}>删除</a>
				</td>

				</tr>
				{/for} {else}
				<tr>
					<td colspan="3" class="center">没有设置信息</td>
				</tr>
				{/if}
		</script>
		<script>
			function upgrade() {
				var index = parent.layer.load(0, {
					shade: [0.2, '#393D49']
				});
				var str = window.location.href;
				id = str.substr(str.lastIndexOf("/") + 1);
				$.getJSON('<%=luci.dispatcher.build_url("api","misstar","appstore")%>', {
					id: id,
					operate: 'upgrade'
				}, function(rsp) {
					if(rsp.code == 0) {
						location.reload();
						parent.layer.close(index);
					} else {
						$.alert(rsp.msg);
						parent.layer.close(index);
					}
				});
			}

			function tips(data, id) {
				var layer = layui.layer;
				layer.tips(data, id);
			}

			function ssInfo() {
				var version, lastversion;
				var xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "get_ss")%>', {}, function(rsp) {
					if(rsp.code == 0) {
						var tpl = $('#tplsslist').html(),
							tpldata = [],
							list = rsp.list,
							current = rsp.current,
							iscurrent = 0;
						sscurrentId = current.id;

						if(list.length > 0) {
							for(var i = 0; i < list.length; i++) {
								if(list[i].id == current.id) {
									iscurrent = 1;

								} else {
									iscurrent = 0;
								}
								var item = {
									id: list[i].id,
									ss_name: list[i].ss_name,
									ss_server: list[i].ss_server,
									ss_server_port: list[i].ss_server_port,
									ss_mode: list[i].ss_mode,
									id: list[i].id,
									iscurrent: iscurrent
								}
								tpldata.push(item);
							}
						}
						$('#sslist').html(tpl.tmpl({
							sslist: tpldata
						}));
						var tpl = $('#tpllanconlist').html();
						list = rsp.LanCon;
						tpldata = [];
						if(list.length > 0) {
							for(var i = 0; i < list.length; i++) {
								var item = {
									mac: list[i].mac,
									name: list[i].name,
									ip: list[i].ip,
									mode: list[i].mode
								}
								tpldata.push(item);
							}
						}
						tpldata.ss_acl_default_mode = rsp.ss_acl_default_mode;
						$('#lanconlist').html(tpl.tmpl({
							lanconlist: tpldata
						}));
						var xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "get_ss_devlist")%>', {}, function(rsp) {
							if(rsp.code == 0) {
								hostlist = rsp.list;
								if(hostlist.length > 0) {
									var obj = document.getElementById("hostname");
									obj.options.length = 0;
									obj.options.add(new Option("请选择设备", "0"));
									for(var i = 0; i < hostlist.length; i++) {
										obj.options.add(new Option(hostlist[i].devname, hostlist[i].mac));
									}
								}
							}
						});
						version = rsp.version;
						document.getElementById("version").innerHTML = version;
						$.ajax({
							url: "http://www.misstar.com/tools/appstore/<%=model%>/applist.php",
							jsonp: 'callback',
							dataType: 'jsonp',
							data: 'rm',
							timeout: 2000,
							success: function(rsp) {
								if(rsp.code == 0) {
									list = rsp.applist;

									for(var i = 0; i < list.length; i++) {
										if(list[i].href == 'ss') {
											lastversion = list[i].version;
											break;
										}
									}

								}
								if(version < lastversion) {
									document.getElementById("upgrade").style.display = "block";
								}
							}
						});
						var str = window.location.href;
						str = str.substr(str.lastIndexOf("/") + 1);
						iframe = parent.document.getElementById(str);
						var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;
						iframe.style.height = dHeight + "px";
					}
					$(".layui-btn").each(function() {
						$(this).unbind('click').click(function() {
							bottonclick($(this).attr('data-type'), $(this).attr('data-id'));
						});
					});
				});
				xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "get_dns")%>', {}, function(rsp) {
					if(rsp.code == 0) {
						var tpl = $('#dnsbody').html();
						var tpldata = {
							dns_mode: '',
							dns_server: '',
							dns_port: ''
						};
						dns_info = rsp.dns_info;
						tpldata.dns_mode = dns_info.dns_mode;
						tpldata.dns_server = dns_info.dns_server;
						tpldata.dns_port = dns_info.dns_port;
						if(dns_info.dns_red_ip == 'lanip') {
							tpldata.dns_red_ip = '';
						} else {
							tpldata.dns_red_ip = dns_info.dns_red_ip;
						}
						tpldata.dns_red_enable = dns_info.dns_red_enable;
						$('#dns_body').html(tpl.tmpl(tpldata));
						setTimeout(function() {
							var form = layui.form();
							form.render();
						}, 100);

						tpl = $('#tplgfwlist').html(),
							tpldata = [],
							list = dns_info.pac_customize;
						if(list.length > 0) {
							paclist = list.split('\n');
							for(var i = 0; i < paclist.length; i++) {
								if(paclist[i] != '') {
									var item = {
										id: i + 1,
										address: paclist[i]
									}
									tpldata.push(item);
								}
							}
						}
						$('#gfwlist').html(tpl.tmpl({
							gfwlist: tpldata
						}));

						tpl = $('#tplwhitelist').html(),
							tpldata = [],
							list = dns_info.chn_list;
						if(list.length > 0) {
							whitelist = list.split('\n');
							for(var i = 0; i < whitelist.length; i++) {
								if(whitelist[i] != '') {
									var item = {
										id: i + 1,
										address: whitelist[i]
									}
									tpldata.push(item);
								}
							}
						}
						$('#whitelist').html(tpl.tmpl({
							whitelist: tpldata
						}));
						$(".layui-btn").each(function() {
							$(this).unbind('click').click(function() {
								bottonclick($(this).attr('data-type'), $(this).attr('data-id'));
							});
						});
						var str = window.location.href;
						str = str.substr(str.lastIndexOf("/") + 1);
						iframe = parent.document.getElementById(str);
						var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;
						iframe.style.height = dHeight + "px";

					}

				});

			}

			layui.use(['form', 'layedit', 'laydate'], function() {
				var form = layui.form(),
					layer = layui.layer,
					layedit = layui.layedit,
					laydate = layui.laydate;

				//创建一个编辑器
				var editIndex = layedit.build('LAY_demo_editor');
				//自定义验证规则
				form.verify({
					title: function(value) {
						if(value.length < 5) {
							return '标题至少得5个字符啊';
						}
					},
					pass: [/(.+){6,12}$/, '密码必须6到12位'],
					gfwverify: [/^[A-Za-z0-9\-.]+$/, '网址格式不正确，请输入比如：baidu.com的地址'],
					whiteverify: [/^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5]).(\d{1,2}|1\d\d|2[0-4]\d|25[0-5]).(\d{1,2}|1\d\d|2[0-4]\d|25[0-5]).(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\/([0-2]\d|3[0-2])$/, '格式不正确']
				});

				//监听提交
				form.on('submit(demo1)', function(data) {
					var url = this.action,
						method = this.method,
						param = $(this).serialize(),
						formName = this.name;
					var index = parent.layer.load(0, {
						shade: [0.2, '#393D49']
					});
					if(data.field.id == '') {
						var reg = new RegExp("=", "g");
						id = BASE64.encoder(data.field.ss_server + data.field.ss_server_port + data.field.ss_password).substr(0, 30);
						data.field.id = id.replace(/\+/g, "");
						data.field.id = id.replace(/\//g, "");
						data.field.id = id.replace(/=/g, "");
					}
					data.field.ss_name = data.field.ss_name.replace(/ /g, "");
					if(data.field.ssr_enable == 'on') {
						data.field.ssr_enable = 1;
					} else {
						data.field.ssr_enable = 0;
					}
					var xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "set_ss")%>', data.field, function(rsp) {
						if(rsp.code == 0) {
							layer.close(dlgform);
							ssInfo();
							//location.reload();
						} else {
							alert("Failed");
						}
						setTimeout(function() {
							parent.layer.close(index);
						}, 200);
					});
					return false;
				});
				form.on('submit(gfwlist)', function(data) {
					var url = this.action,
						method = this.method,
						param = $(this).serialize(),
						formName = this.name;
					var index = parent.layer.load(0, {
						shade: [0.2, '#393D49']
					});

					var xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "add_pac")%>', data.field, function(rsp) {
						if(rsp.code == 0) {
							layer.close(dlgform);
							ssInfo();
							//location.reload();
						} else {
							alert("Failed");
						}
						setTimeout(function() {
							parent.layer.close(index);
							location.reload();
						}, 200);
					});
					return false;
				});
				form.on('submit(whitelist)', function(data) {
					var url = this.action,
						method = this.method,
						param = $(this).serialize(),
						formName = this.name;
					var index = parent.layer.load(0, {
						shade: [0.2, '#393D49']
					});

					var xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "add_white")%>', data.field, function(rsp) {
						if(rsp.code == 0) {
							layer.close(dlgform);
							ssInfo();
							//location.reload();
						} else {
							alert("Failed");
						}
						setTimeout(function() {
							parent.layer.close(index);
							location.reload();
						}, 200);
					});
					return false;
				});
				form.on('submit(dnssetting)', function(data) {
					var url = this.action,
						method = this.method,
						param = $(this).serialize(),
						formName = this.name;
					var index = parent.layer.load(0, {
						shade: [0.2, '#393D49']
					});
					data.field.dns_red_enable == 'on' ? data.field.dns_red_enable = 1 : data.field.dns_red_enable = 0;
					if(data.field.dns_red_ip == '') {
						data.field.dns_red_ip = 'lanip';
					}
					var xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "set_dns")%>', data.field, function(rsp) {
						if(rsp.code == 0) {
							//layer.close(dlgform);
							ssInfo();
							//location.reload();
						} else {
							alert("Failed");
						}
						setTimeout(function() {
							parent.layer.close(index);
							location.reload();
						}, 200);
					});
					return false;
				});
				form.on('select(dns_mode)', function(data) {
					mode = data.value;
					switch(mode) {
						case "pdnsd":
							data = "正常情况下推荐PDNSD，如果提示DNS放污染失败，请尝试DNS2SOCKS";
							break;
						case "dns2socks":
							data = "dns解析走ss线路，效果受ss线路延迟影响。";
							break;
					}
					layer.tips(data, "#dns_mode");
				});
			});
		</script>
		<script>
			function get_ss_status() {
				var xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "get_ssstatus")%>', {}, function(rsp) {
					if(rsp.code == 0) {
						var status = rsp.ss_status;
						if(status.ss_status == 1) {
							document.getElementById("ss_status").innerHTML = "未运行";
							document.getElementById("ss_node").innerHTML = "无";

						} else if(status.ss_status == 2) {
							document.getElementById("ss_status").innerHTML = "运行中，国外网站加速成功！";
							document.getElementById("ss_node").innerHTML = status.ss_node;
						} else if(status.ss_status == 3) {
							document.getElementById("ss_status").innerHTML = "运行中，国外网站加速失败，请检查ss账号。";
							document.getElementById("ss_node").innerHTML = status.ss_node;
						}

						if(status.ss_dnsstatus == 0) {
							document.getElementById("dns_status").innerHTML = "DNS防污染失败！";
						} else if(status.ss_dnsstatus == 1) {
							document.getElementById("dns_status").innerHTML = "DNS防污染成功。";
						}
					}
					var status = rsp.ss_status,
						uptime = '',
						statusCode = 3,
						trstatus,
						statusText;
					ssConnectStatus = parseInt(rsp.ss_status.ss_status);
					// 0 connected 1 connecting 2 failed 3 close
					switch(ssConnectStatus) {
						case 2:
							statusText = '<%:已连接%>';
							//uptime = secondToDate(rsp.uptime);
							trstatus = 'conn-st-2';
							break;
						case 3:
							statusText = '<%:连接失败%>';
							trstatus = 'conn-st-1';
							break;
						case 1:
							statusText = '<%:已断开%>';
							trstatus = 'conn-st-1';
							break;
						case 4:
							statusText = '<%:未启用%>';
							trstatus = 'conn-st-3';
							break;
						default:
							statusText = '<%:连接异常%>';
							trstatus = 'conn-st-3';
							break;
					}

					if(rsp.errcode) {
						// statusText = rsp.errmsg;
						statusText = '<span class="errmsg-wrap" data-error="' + rsp.errmsg + '"><%:连接失败%></span>';
						uptime = '';
					};
					var el = document.getElementById(sscurrentId);
					if(el) {
						el.className = trstatus;
						$('.ss-status .val', el).html(statusText);
						if(ssConnectStatus != 2) {
							ctrlstatus = "<a href='javascript:;' class='layui-btn layui-btn-normal layui-btn-mini' data-type='connect' data-id=" +
								sscurrentId +
								">重接</a>	<a href='javascript:;' class='layui-btn layui-btn-mini' data-type='edit' data-id=" +
								sscurrentId +
								">编辑</a>	<a href='javascript:;' class='layui-btn layui-btn-danger layui-btn-mini' data-type='del' data-id=" +
								sscurrentId + ">删除</a>";

						} else {
							ctrlstatus = "<a href='javascript:;' class='layui-btn layui-btn-normal layui-btn-mini' data-type='disconnect' data-id=" + sscurrentId + ">断开连接</a>"
						}
						$('.ss_status .control', el).html(ctrlstatus);
					}
					$(".layui-btn").each(function() {
						$(this).unbind('click').click(function() {
							bottonclick($(this).attr('data-type'), $(this).attr('data-id'));
						});
					});
				});
				return xhr;
			}

			//			function fileimport() {
			//				var selectedFile = document.getElementById("uploadfile").files[0]; //获取读取的File对象
			//
			//				var reader = new FileReader(); //这里是核心！！！读取操作就是由它完成的。
			//				reader.readAsText(selectedFile); //读取文件的内容
			//
			//				reader.onload = function() {
			//					var obj = JSON.parse(this.result);
			//					alert(JSON.stringify(obj.configs[0]));
			//					//
			//					//					$("#uploadfile").unbind().change(function() {
			//					//						$("#fileForm").submit();
			//					//					})
			//				};
			//			}
		function loaddevlist() {
			if(hostlist.length > 0) {
				mac = $('#hostname option:selected').val();
				for(var i = 0; i < hostlist.length; i++) {
					if(hostlist[i].mac == mac) {
						document.getElementById("hostip").innerHTML = hostlist[i].ip;
						document.getElementById("hostmac").innerHTML = mac;
					}
				}
			} else {
				alert("获取设备信息失败或所有设备均已配置或没有设备连接到路由器。");
			}
		}

			function bottonclick(datatype, id) {
				switch(datatype) {
					case "add":
						var tpl = $('#tpladdss').html(),
							tpldata = {};
						dlgform = layer.open({
							type: 1,
							title: "添加节点",
							skin: 'layui-layer-rim', //加上边框
							area: ['500px', '650px'],
							content: tpl.tmpl(tpldata),
							anim: 2,
							zIndex: 1,
							shadeClose: true, //开启遮罩关闭
							btnAlign: 'c',
							scrollbar: false
						});
						setTimeout(function() {
							var form = layui.form();
							form.render();
						}, 100);
						break;
					case "addgfw":
						var tpl = $('#tpladdgfw').html(),
							tpldata = {};
						dlgform = layer.open({
							type: 1,
							title: "添加地址",
							skin: 'layui-layer-rim', //加上边框
							area: ['450px', '180px'],
							content: tpl.tmpl(tpldata),
							anim: 2,
							zIndex: 1,
							shadeClose: true, //开启遮罩关闭
							btnAlign: 'c',
							scrollbar: false
						});
						setTimeout(function() {
							var form = layui.form();
							form.render();
						}, 100);
						break;
					case "addwhite":
						var tpl = $('#tpladdwhite').html(),
							tpldata = {};
						dlgform = layer.open({
							type: 1,
							title: "添加地址",
							skin: 'layui-layer-rim', //加上边框
							area: ['450px', '180px'],
							content: tpl.tmpl(tpldata),
							anim: 2,
							zIndex: 1,
							shadeClose: true, //开启遮罩关闭
							btnAlign: 'c',
							scrollbar: false
						});
						setTimeout(function() {
							var form = layui.form();
							form.render();
						}, 100);
						break;
					case "del":
						var index = parent.layer.load(0, {
							shade: [0.2, '#393D49']
						});
						$.getJSON('<%=luci.dispatcher.build_url("api","misstar","del_ss")%>', {
							id: id
						}, function(rsp) {
							if(rsp.code == 0) {
								ssInfo();
								parent.layer.close(index);
							} else {
								$.alert(rsp.msg);
								parent.layer.close(index);
							}
						});
						break;
					case "delgfw":
						var index = parent.layer.load(0, {
							shade: [0.2, '#393D49']
						});
						id = id.replace(/\//g, "\\/");
						$.getJSON('<%=luci.dispatcher.build_url("api","misstar","del_pac")%>', {
							address: id
						}, function(rsp) {
							if(rsp.code == 0) {
								ssInfo();
								parent.layer.close(index);
							} else {
								$.alert(rsp.msg);
								parent.layer.close(index);
							}
						});
						break;
					case "delwhite":
						var index = parent.layer.load(0, {
							shade: [0.2, '#393D49']
						});
						id = id.replace(/\//g, "\\/");
						$.getJSON('<%=luci.dispatcher.build_url("api","misstar","del_white")%>', {
							address: id
						}, function(rsp) {
							if(rsp.code == 0) {
								ssInfo();
								parent.layer.close(index);
							} else {
								$.alert(rsp.msg);
								parent.layer.close(index);
							}
						});
						break;
					case "edit":
						var index = parent.layer.load(0, {
							shade: [0.2, '#393D49']
						});
						$.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "getssdetail")%>', {
							id: id
						}, function(rsp) {
							if(rsp.code == 0) {
								var ss_detail = rsp.ss_detail;
								var tpl = $('#tpladdss').html();
								tpldata = {
									ss_server_port: '',
									ss_password: '',
									ss_server: '',
									ss_method: '',
									ssr_obfs: '',
									ssr_enable: '',
									ssr_protocol: '',
									ss_name: '',
									ss_mode: ''
								};
								tpldata.ss_server = ss_detail.ss_server;
								tpldata.ss_server_port = ss_detail.ss_server_port;
								tpldata.ss_password = ss_detail.ss_password;
								tpldata.ss_method = ss_detail.ss_method;
								tpldata.ssr_enable = ss_detail.ssr_enable;
								tpldata.ssr_protocol = ss_detail.ssr_protocol;
								tpldata.ssr_obfs = ss_detail.ssr_obfs;
								tpldata.ss_name = ss_detail.ss_name;
								tpldata.ss_mode = ss_detail.ss_mode;
								tpldata.id = id;
								dlgform = layer.open({
									type: 1,
									title: "编辑节点",
									skin: 'layui-layer-rim', //加上边框
									area: ['500px', '650px'],
									content: tpl.tmpl(tpldata),
									anim: 2,
									zIndex: 1,
									shadeClose: true, //开启遮罩关闭
									btnAlign: 'c',
									scrollbar: false
								});
								setTimeout(function() {
									var form = layui.form();
									form.render();
									parent.layer.close(index);
								}, 100);

							}
						});
						break;
					case "disconnect":
						var index = parent.layer.load(0, {
							shade: [0.2, '#393D49']
						});
						$.getJSON('<%=luci.dispatcher.build_url("api","misstar","dconn_ss")%>', {}, function(rsp) {
							if(rsp.code == 0) {
								ssInfo();
								parent.layer.close(index);
							} else {
								$.alert(rsp.msg);
							}

						});

						break;
					case "connect":
						var index = parent.layer.load(0, {
							shade: [0.2, '#393D49']
						});
						$.getJSON('<%=luci.dispatcher.build_url("api","misstar","conn_ss")%>', {
							id: id
						}, function(rsp) {
							if(rsp.code == 0) {
								location.reload();
								parent.layer.close(index);
							} else {
								$.alert(rsp.msg);
							}

						});

						break;
					case "import":
						alert("本插件支持导入标准电脑端ss配置文件gui-config.json,其他文件无法识别！");
						$("#uploadfile").click();
						$("#uploadfile").unbind().change(function() {
							var selectedFile = document.getElementById("uploadfile").files[0]; //获取读取的File对象

							var reader = new FileReader(); //这里是核心！！！读取操作就是由它完成的。
							reader.readAsText(selectedFile); //读取文件的内容

							reader.onload = function() {

								var obj = JSON.parse(this.result);
								var index = parent.layer.load(0, {
									shade: [0.2, '#393D49']
								});

								var i = 0;

								function impss() {
									if(i < obj.configs.length) {
										setTimeout(function() {
											var id = BASE64.encoder(obj.configs[i].remarks + obj.configs[i].server + obj.configs[i].server_port + obj.configs[i].remarks_base64).substr(0, 30);
											id = id.replace(/\//g, "");
											name = obj.configs[i].remarks.split("-")[0];
											name = name.replace(/ /g, "");
											if(typeof(obj.configs[i].obfs) == "undefined") {
												obj.configs[i].obfs = "plain"
											}

											if(typeof(obj.configs[i].protocol) == "undefined") {
												obj.configs[i].protocol = "origin"
											}
											var data = {
												ss_name: name,
												ss_server: obj.configs[i].server,
												ss_server_port: obj.configs[i].server_port,
												ss_password: obj.configs[i].password,
												ss_method: obj.configs[i].method,
												id: id,
												ss_mode: 'gfwlist',
												ssr_enable: '0',
												ssr_obfs: obj.configs[i].obfs,
												ssr_protocol: obj.configs[i].protocol
											};
											parent.layer.msg('正在导入' + name);
											var xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "set_ss")%>', data, function(rsp) {
												if(rsp.code == 0) {} else {
													alert("失败！");
												}

											});
											i++;
											impss();
										}, 1000)
									} else {
										setTimeout(function() {
											parent.parent.layer.close(index);
											location.reload();
										}, 1000)
									}
								}
								impss();
							};
						})
						break;
					case "submit":
					case "delete":
						var obj = document.getElementById(id);
						var index = obj.selectedIndex;
						mode = obj.options[index].value;
						if(id == "add") {
							id = $('#hostmac').text();
							if(id == '') {
								alert("请选择要添加的设备！");
								return 0;
							}
						}
						var index = parent.layer.load(0, {
							shade: [0.2, '#393D49']
						});
						$.getJSON('<%=luci.dispatcher.build_url("api","misstar","set_ss_lancon")%>', {
							mac: id,
							mode: mode,
							opt: datatype
						}, function(rsp) {
							if(rsp.code == 0) {
								ssInfo();
								parent.layer.close(index);
							} else {
								$.alert(rsp.msg);
								parent.layer.close(index);
							}
						});
						break;
					case "importgfw":
						alert("导入文件一行一个，比如：baidu.com");
						$("#uploadfile").click();
						$("#uploadfile").unbind().change(function() {
							var selectedFile = document.getElementById("uploadfile").files[0]; //获取读取的File对象

							var reader = new FileReader(); //这里是核心！！！读取操作就是由它完成的。
							reader.readAsText(selectedFile); //读取文件的内容
							reader.onload = function() {
								var obj = this.result.split('\n');
								var index = parent.layer.load(0, {
									shade: [0.2, '#393D49']
								});
								for(var i = 0; i < obj.length; i++) {
									if(obj[i] != '')
										var data = {
											address: obj[i]
										};
									var xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "add_pac")%>', data, function(rsp) {
										if(rsp.code == 0) {} else {
											alert("失败！");
										}

									});
								}
								parent.layer.close(index);
								location.reload();
							};
						})
						break;
					case "importwhite":
						alert("导入文件一行一个，比如：10.10.10.0/24");
						$("#uploadfile").click();
						$("#uploadfile").unbind().change(function() {
							var selectedFile = document.getElementById("uploadfile").files[0]; //获取读取的File对象

							var reader = new FileReader(); //这里是核心！！！读取操作就是由它完成的。
							reader.readAsText(selectedFile); //读取文件的内容
							reader.onload = function() {
								var obj = this.result.split('\n');
								var index = parent.layer.load(0, {
									shade: [0.2, '#393D49']
								});
								for(var i = 0; i < obj.length; i++) {
									if(obj[i] != '')
										var data = {
											address: obj[i]
										};
									var xhr = $.getJSON('<%=luci.dispatcher.build_url("api", "misstar", "add_white")%>', data, function(rsp) {
										if(rsp.code == 0) {} else {
											alert("失败！");
										}

									});
								}
								parent.layer.close(index);
								location.reload();
							};
						})
						break;
				}
			}
			var modelSs = (function() {

				return {
					init: function() {
						ssInfo();
					}
				}

			}());
			$(function() {
				modelSs.init();
				window.setInterval("get_ss_status()", 5000);
			});
		</script>
	</body>

</html>